<template>
    <div>
      <!-- 面包屑导航区 -->
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>订单管理</el-breadcrumb-item>
        <el-breadcrumb-item>物流信息</el-breadcrumb-item>
      </el-breadcrumb>
  
      <!-- 表单区域 -->
      <el-form ref="form" label-width="80px">
        <el-timeline>
          <el-timeline-item
            v-for="(activity, index) in activities"
            :key="index"
            :icon="activity.icon"
            :type="activity.type"
            :color="activity.color"
            :size="activity.size"
            :timestamp="activity.timestamp"
          >
            {{ activity.content }}
          </el-timeline-item>
        </el-timeline>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">确定</el-button>
        </el-form-item>
      </el-form>
    </div>
  </template>
  
  <script>
  export default {
     data() {
      return {
        id:this.$route.params.id,

          activities:[
           {
            timestamp: "2018-05-10 09:39:00",
            content: "已签收,感谢使⽤顺丰,期待再次为您服务",
            location: "",
           
            size: 'large',
          
           },
           {
            timestamp: "2018-05-10 08:23:00",
            content: "[北京市]北京海淀育新⼩区营业点派件员 顺丰速运 95338正在为您派件",
            location: "",
         
            size: 'large',
          
           },
           {
            timestamp: "2018-05-10 07:32:00",
            content: "快件到达 [北京海淀育新⼩区营业点]",
            location: "",
           
            size: 'large',
          
           },
           {
            timestamp: "2018-05-10 02:03:00",
            content: "快件在[北京顺义集散中⼼]已装⻋,准备发往 [北京海淀育新⼩区营业点]",
            location: "",
            
            size: 'large',
           
           },
           {
            timestamp: "2018-05-09 23:05:00",
            content: "快件到达 [北京顺义集散中⼼]",
            location: "",
            type: 'primary',
            size: 'large',
            color: '#0bbd87'
           },
           {
            timestamp: "2018-05-09 21:21:00",
            content: "快件在[北京宝胜营业点]已装⻋,准备发往 [北京顺义集散中⼼]",
            location: "",
            type: 'primary',
            size: 'large',
            color: '#0bbd87'
           },
           {
            timestamp: "2018-05-09 13:07:00",
            content: "顺丰速运 已收取快件",
            location: "",
            type: 'primary',
            size: 'large',
            color: '#0bbd87'
           },
           {
            timestamp: "2018-05-09 12:25:03",
            content: "卖家发货",
            location: "",
            type: 'primary',
            size: 'large',
            color: '#0bbd87'
           },
           {
            timestamp: "2018-05-09 12:22:24",
            content: "您的订单将由HLA（北京海淀区清河中街店）⻔店安排发货。",
            location: "",
            type: 'primary',
            size: 'large',
            color: '#0bbd87'
           },
           {
            timestamp: "2018-05-08 21:36:04",
            content: "商品已经下单",
            location: "",
            type: 'primary',
            size: 'large',
            color: '#0bbd87'
           }
        ]
      }
     },
     created() {
     },
     methods:{
      onSubmit() {
        this.$router.push('/orders/')
       
        },
     }
  }
  </script>
  
  <style>
  </style>